<template>
	<view class="content">

		<top-login></top-login>

		<view class="notice" @click="goNotice()" v-if="notice_show">
			<u-notice-bar bgColor='#E6EDF5' color='rgba(17, 2, 2, 1)' :text="notice.title"></u-notice-bar>
		</view>

		<view class="swiper">
			<u-swiper :list="list1" @change="e => currentNum = e.current" keyName="image_url"
				indicatorStyle="right: 40rpx" height='100%' radius='10' @click="goBanner">
				<view slot="indicator" class="indicator-num">
					<text
						class="indicator-num__text"><text>{{ currentNum + 1 }}</text><text>/</text><text>{{ list1.length }}</text></text>
				</view>
			</u-swiper>
		</view>

		<view class="tabs">
			<view class="s1" @click="goApplyPartnerPage()">
				<image src="@/static/icon/mxvip.png"></image>
				<text>梦想VIP</text>
			</view>
			<view class="s1 s1-1" @click="goActivityListPage()">
				<image src="@/static/icon/shop.png"></image>
				<text>商家活动</text>
			</view>
		</view>

		<view class="about">
			<view class="title">公司介绍</view>
			<u-parse class="nodes" :content="vuex_theme.about"></u-parse>
		</view>

	</view>
</template>

<script>
	import topLogin from '@/components/topLog.vue';

	export default {
		components: {
			topLogin
		},
		data() {
			return {
				currentNum: 0,
				list1: [],
				nav_show: false,
				notice: {},
				notice_show: false,
			}
		},
		onLoad() {
			this.getBanner();
			this.getNotice();
		},
		methods: {
			getNotice() {
				this.$API.getNiticeOne().then(res => {
					this.notice = res.data;
					if (res.data != '') {
						this.notice_show = true;
					}
				})
			},
			getBanner() {
				uni.showLoading();
				this.$API.getBanner().then(res => {
					this.list1 = res.data
					uni.hideLoading();
				}).catch(err => {
					uni.hideLoading();
				});
			},
			goBanner(index) {
				let item = this.list1[index]
				uni.navigateTo({
					url: '/pages/index/web?type=banner&id=' + item.id
				})
			},
			// goApplyPartnerPage() {
			// 	if (this.vuex_token == '') {
			// 		uni.navigateTo({
			// 			url: '/pages/my/login'
			// 		})
			// 		return false;
			// 	}
			// 	if (this.vuex_user.is_partner) {
			// 		return uni.navigateTo({
			// 			url: '/pages/my/index'
			// 		})
			// 	}
			// 	uni.navigateTo({
			// 		url: '/pages/second/partner'
			// 	})
			// },
			goActivityListPage() {
				uni.navigateTo({
					url: '/pages/activity/index'
				})
			},
			goNotice() {
				uni.navigateTo({
					url: '/pages/index/web?type=notice&id=' + this.notice.id
				})
			},
		}
	}
</script>

<style lang="scss">
	.content {
		@include flex(column);
		align-items: center;
		justify-content: center;
		width: 662rpx;
		margin: 0 auto;
		padding-bottom: 100rpx;
	}

	.notice {
		width: 662rpx;
		margin-top: 36rpx;

		.u-notice-bar {
			border-radius: 28rpx;
		}
	}

	.swiper {
		width: 662rpx;
		height: 314rpx;
		margin-top: 36rpx;

		.indicator-num {
			min-width: 90rpx;
			height: 44rpx;
			line-height: 44rpx;
			padding: 2px 0;
			background-color: rgba(0, 0, 0, 0.39);
			border-radius: 100rpx;
			width: 90rpx;
			@include flex;
			justify-content: center;

			&__text {
				color: rgba(255, 255, 255, 0.50);
				font-size: 24rpx;

				text {
					&:nth-child(1) {
						font-size: 28rpx;
						color: rgba(255, 255, 255, 1);
					}

					&:nth-child(2) {
						margin: 0 5rpx;
					}
				}
			}
		}
	}

	.tabs {
		width: 662rpx;
		@include flex;
		justify-content: space-between;
		align-items: center;
		margin-top: 36rpx;

		.s1 {
			width: 315rpx;
			height: 88rpx;
			text-align: center;
			@include flex;
			align-items: center;
			justify-content: center;
			background-color: #fff;
			border-radius: 28rpx;
			box-shadow: 0 8rpx 16rpx 0 rgba(118, 119, 235, 0.26);

			image {
				width: 32rpx;
				height: 32rpx;
			}

			text {
				height: 32rpx;
				font-size: 32rpx;
				font-family: PingFang SC, PingFang SC;
				font-weight: 400;
				color: #7677EB;
				line-height: 32rpx;
				margin-left: 16rpx;
			}
		}

		.s1-1 {
			background-color: #7677EB;

			text {
				color: #fff;
			}
		}
	}

	.about {
		background-color: #fff;
		border-radius: 48rpx;
		padding: 30rpx;
		display: flex;
		width: 602rpx;
		margin-top: 36rpx;
		@include flex(column);

		.title {
			height: 36rpx;
			font-size: 36rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: 600;
			color: #110202;
			line-height: 36rpx;
			margin-top: 20rpx;
		}

		.nodes {
			margin-top: 32rpx;
			line-height: 2;
			font-size: 28rpx;
		}
	}
</style>